<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>收货地址</title>
		<link rel="stylesheet" type="text/css" href="../../static/css/site.css"/>
		<link rel="stylesheet" type="text/css" href="../../static/css/center.css"/>
	</head>
	<body>
		<div class="header">
			<div class="nav clear">
				<div class="container">
					<div class="left">
						<ul>
							<li><a href="index.html">小米商城</a></li>
							<li><a href="">MIUI</a></li>
							<li><a href="">IoT</a></li>
							<li><a href="">云服务</a></li>
							<li><a href="">天星数科</a></li>
							<li><a href="">有品</a></li>
							<li><a href="">小爱开放平台</a></li>
							<li><a href="">企业团购</a></li>
							<li><a href="">资质证照</a></li>
							<li><a href="">协议规则</a></li>
							<li><a href="">下载app</a></li>
							<li><a href="">智能生活</a></li>
							<li><a href="">Select Location</a></li>
						</ul>
					</div>
					<div class="right">
						<ul>
							<li><a href="user/login.html">登录</a></li>
							<li><a href="user/reg.html">注册</a></li>
							<li><a href="">消息通知</a></li>
							<li class="cart dropdown">
								<a href="user/cart.html">
									<i class="mi-icon icon-cart"></i>
									 购物车 (0)
								</a>
								<div class="dropdown-content">
									购物车中还没有商品，赶紧选购吧！
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<div class="site-header">
				<div class="container clear">
					<div class="logo left">
						<a href="index.html"><img src="../../static/img/logo-mi.png" ></a>
					</div>
					<div class="menu left">
						<ul class="clear">
							<li><a href="">Xiaomi手机</a></li>
							<li><a href="">Redmi 红米</a></li>
							<li><a href="">电视</a></li>
							<li><a href="">笔记本</a></li>
							<li><a href="">平板</a></li>
							<li><a href="">家电</a></li>
							<li><a href="">路由器</a></li>
							<li><a href="">智能硬件</a></li>
							<li><a href="">服务</a></li>
							<li><a href="">社区</a></li>
						</ul>
					</div>
					<div class="search right">
						<input type="text" id="key" class="search-key left"/>
						<button type="button"><i class="mi-icon icon-search left"></i></button>
					</div>
				</div>
			</div>
		</div>
		
		<div class="user-center">
			<div class="container clear">
				<div class="crumbs">
					<a href="../index.html">首页</a>
					<span class="sep">/</span>
					<a >收货地址</a>
				</div>
				
				<div class="menu">
					<h3>订单中心</h3>
					<ul>
						<li><a href="">我的订单</a></li>
						<li><a href="">评价晒单</a></li>
						<li><a href="">话费充值订单</a></li>
						<li><a href="">以旧换新订单</a></li>
					</ul>
					
					<h3>个人中心</h3>
					<ul>
						<li><a href="">我的个人中心</a></li>
						<li class="active"><a href="">收货地址</a></li>
						<li><a href="">消息通知</a></li>
						<li><a href="">购买资格</a></li>
						<li><a href="">现金账户</a></li>
						<li><a href="">小米礼品卡</a></li>
						<li><a href="">现金券</a></li>
						<li><a href="">喜欢的商品</a></li>
						<li><a href="">优惠券</a></li>
						<li><a href="">红包</a></li>
					</ul>
					
					
					<h3>售后服务</h3>
					<ul>
						<li><a href="">服务记录</a></li>
						<li><a href="">申请服务</a></li>
						<li><a href="">领取快递报销</a></li>
					</ul>
					
					
					<h3>账户管理</h3>
					<ul>
						<li><a href="">个人信息</a></li>
						<li><a href="">修改密码</a></li>
					</ul>
				</div>
				<div class="content">
					<h1 class="title">收货地址</h1>
					
					<ul class="addr-list clear">
						<li class="new-addr">
							<div class="add">
								<div><i class="mi-icon icon-add"></i></div>
								添加新地址
							</div>
						</li>
						<li data-id="1" >
							<div class="name">
								张三
							</div>
							<div class="phone">
								158****6789
							</div>
							<div class="address">
								<span class="province">山东省</span>
								<span class="city">青岛市</span>
								<span class="area">城阳区</span>
								<span class="town">城阳街道</span>
								<span class="detail">金日紫都 办公楼 A座 中享思途 三楼</span>
							</div>
							
							<div class="actions">
								<a href="javascript:void(0);">修改</a>
								<a href="javascript:void(0);">删除</a>
							</div>
						</li>
						<li data-id="1" >
							<div class="name">
								张三
							</div>
							<div class="phone">
								158****6789
							</div>
							<div class="address">
								<span class="province">山东省</span>
								<span class="city">青岛市</span>
								<span class="area">城阳区</span>
								<span class="town">城阳街道</span>
								<span class="detail">金日紫都 办公楼 A座 中享思途 三楼</span>
							</div>
							
							<div class="actions">
								<a href="javascript:void(0);">修改</a>
								<a href="javascript:void(0);">删除</a>
							</div>
						</li>
						<li data-id="1" >
							<div class="name">
								张三
							</div>
							<div class="phone">
								158****6789
							</div>
							<div class="address">
								<span class="province">山东省</span>
								<span class="city">青岛市</span>
								<span class="area">城阳区</span>
								<span class="town">城阳街道</span>
								<span class="detail">金日紫都 办公楼 A座 中享思途 三楼</span>
							</div>
							
							<div class="actions">
								<a href="javascript:void(0);">修改</a>
								<a href="javascript:void(0);">删除</a>
							</div>
						</li>
						<li data-id="1" >
							<div class="name">
								张三
							</div>
							<div class="phone">
								158****6789
							</div>
							<div class="address">
								<span class="province">山东省</span>
								<span class="city">青岛市</span>
								<span class="area">城阳区</span>
								<span class="town">城阳街道</span>
								<span class="detail">金日紫都 办公楼 A座 中享思途 三楼</span>
							</div>
							
							<div class="actions">
								<a href="javascript:void(0);">修改</a>
								<a href="javascript:void(0);">删除</a>
							</div>
						</li>
					</ul>
					
				</div>
			</div>
		</div>
		
		<!-- 底部 -->
		<div class="site-footer">
			<div class="container">
				<div class="footer-service">
					<ul class="clear">
						<li><a href=""><i class="mi-icon icon-util"></i>预约维修服务</a></li>
						<li><a href=""><i class="mi-icon icon-log"></i>7天无理由退货</a></li>
						<li><a href=""><i class="mi-icon icon-diamond"></i>15天免费换货</a></li>
						<li><a href=""><i class="mi-icon icon-heart"></i>满69包邮</a></li>
						<li><a href=""><i class="mi-icon icon-location"></i>520余家售后网点</a></li>
					</ul>
				</div>
			</div>
		</div>
		
		<div class="add-addr">
			<div class="dialog">
				<div class="content">
					<div class="title">
						添加收货地址
					</div>
					<div class="close">
						<a href="javascript:;"><i class="mi-icon icon-close"></i></a>
					</div>
					
					<form action="" method="post">
						<div class="row">
							<input type="text" name="contact" placeholder="联系人"/>
							<input type="text" name="phone" placeholder="电话" />
						</div>
						<div class="row">
							<select name="province">
								<option value="">省</option>
							</select>
							<select name="city">
								<option value="">市</option>
							</select>
							<select name="area">
								<option value="">区</option>
							</select>
							<select name="town">
								<option value="">乡镇/街道</option>
							</select>
						</div>
						<div class="row">
							<textarea name="detail" placeholder="详细地址"></textarea>
						</div>
						<div class="row btn-row">
							<a href="javascript:;" class="btn btn-submit">提交</a>
							<a href="javascript:;" class="btn btn-cancel">取消</a>
						</div>
					</form>
				</div>
			</div>
		</div>
		
		<script src="../../static/js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(".new-addr").click(function(){
				$(".add-addr").fadeIn(300);
			});
			$(".add-addr .close").click(function(){
				$(".add-addr").fadeOut(300);
			});
			$(".btn-cancel").click(function(){
				$(".add-addr").fadeOut(300);
			});
			$(".btn-submit").click(function(){
				$(".add-addr").fadeOut(300);
			});
		</script>
	</body>
</html>
